<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>

<%@include file="../../WEB-INF/jspf/admin.jspf" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <link href="../../jq/redmond/jquery-ui-1.10.3.custom.min.css" type="text/css" rel="stylesheet"/>
        <link href="../../css/main.css" type="text/css" rel="stylesheet"/>
        <link href="../../jq/menu/menu.css" type="text/css" rel="stylesheet"/>
        <link href="../../jq/menu/submenu.css" type="text/css" rel="stylesheet"/>

        <link href="../../parainfo/form/form.css" type="text/css" rel="stylesheet"/>
        <link href="../../parainfo/table/table.css" type="text/css" rel="stylesheet"/>

        <script src="../../jq/jquery-1.10.2.min.js" type="text/javascript"></script>
        <script src="../../jq/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
        <script src="../../jq/i18n/jquery.ui.datepicker-es.min.js" type="text/javascript"></script>
        <script src="../../jq/menu/menu.js" type="text/javascript"></script>
        <script src="../../jq/menu/submenu.js" type="text/javascript"></script>

        <script src="../../parainfo/form/form.js" type="text/javascript"></script>
        <script src="../../parainfo/table/table.js" type="text/javascript"></script>
        <script src="js/horarios_tur.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="ctop">
            <%@include file="../../WEB-INF/jspf/top.jspf" %>
        </div>

        <div id="m_menu">
            <%@include file="../../WEB-INF/jspf/menu.jspf" %>
        </div>

        <div id="cmenu2">
            <%@include file="../../WEB-INF/jspf/submenu.jspf" %>
        </div>

        <div id="cdata">

            <h2 style="text-align: center;margin-bottom: 20px;color: #3fa7c5">Mantenimiento de Turno</h2>

            <form class="parainfo" action="#" style="margin: auto;display: table">
                <fieldset>
                    <legend>Filtro de Búsqueda</legend>

                    <table>
                        <tr>
                            <td>Año</td>
                            <td>
                                <select id="annio" onchange="jsannio();" style="width: 320px">
                                    <option value="0">Seleccione...</option>
                                </select>

                            </td>
                        </tr>
                        <tr>
                            <td>Unid. Ejecutora</td>
                            <td>
                                <select id="uejecutora" onchange="jsuejecutora();" style="width: 320px">
                                    <option value="0">Seleccione...</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>Corte</td>
                            <td>
                                <select id="corte" onchange="jscorte();" style="width: 320px">
                                    <option value="0">Seleccione...</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>Estado</td>
                            <td>
                                <select id="estado" style="width: 320px">
                                    <option value="0">Seleccione...</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <th colspan="2" style="text-align: center;padding: 20px">
                                <input type="button" onclick="jsQry();"
                                       value="Actualizar"/>
                            </th>
                        </tr>
                    </table>
                </fieldset>
            </form>

            <table style="margin: auto;margin-top: 30px;margin-bottom: 30px">
                <tr>
                    <td style="vertical-align: top">
                        <table class="parainfo" style="width: 750px">
                            <thead>
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>Descripci&oacute;n</td>
                                    <td>Hora Turno</td>
                                    <td>Hora Refrigerio</td>
                                    <td>Fecha Inicio</td>
                                    <td>Estado</td>
                                </tr>
                            </thead>

                            <tbody id="qbody">
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>

                            </tbody>
                        </table>
                    </td>

                    <td style="vertical-align: top">
                        <table class="crud">
                            <tr>

                                <td>
                                    <a href="#" onclick="jsIns();" title="Nuevo">
                                        <img src="../../images/ins.png"/></a>
                                </td>
                                <td>
                                    <a href="#" onclick="jsCon();" title="Consultar">
                                        <img src="../../images/find2.png"/></a>
                                </td>
                            </tr>
                            <tr>

                                <td>
                                    <a href="#" onclick="jsEst();" title="Cambiar Estado">
                                        <img src="../../images/upd_est.png"/></a>
                                </td>
                                <td>
                                    <a href="#" onclick="jsExcel();" title="Exportar a Excel">
                                        <img src="../../images/excel.png"/></a>
                                </td>
                            </tr>

                        </table>
                    </td>
                </tr>
            </table>



            <%-- para INS  --%>
            <div style="display: none">
                <div id="dins" title="Nuevo Turno">
                    <table>
                        <tr>
                            <td>&nbsp</td>
                            <td>Año</td>
                            <td colspan="5" >
                                <input type="text" id="anno_ins" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>&nbsp</td>
                            <td>Und.&nbsp;Ejecutora</td>
                            <td colspan="5" >
                                <input type="text" id="uejecutora_ins" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>&nbsp</td>
                            <td>Corte</td>
                            <td colspan="5" >
                                <input type="text" id="corte_ins" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>

                        <tr>
                            <td>&nbsp</td>
                            <td>Descripci&oacute;n</td>
                            <td colspan="5" >
                                <input type="text" id="turno_des" 
                                       maxlength="100" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>&nbsp</td>
                            <td>Fecha Inicio</td>
                            <td colspan="5">
                                <input type="text" id="fecha_ins" readonly="readonly" 
                                       style="width: 100px;margin-right:4px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>&nbsp</td>
                            <td colspan="6" style="padding-top: 16px">Hora Turno</td>
                        </tr>
                        <tr>
                            <td>&nbsp</td>
                            <td style="text-align: right">Ingreso</td>
                            <td>
                                <input type="text" id="turno_ingh" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                            <td>
                                <input type="text" id="turno_ingm" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                            <td style="text-align: right">Salida</td>
                            <td style="text-align: right">
                                <input type="text" id="turno_salh" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                            <td style="text-align: right">
                                <input type="text" id="turno_salm"  maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                        </tr>
                        <tr>
                            <td> <input type="checkbox" id="checkHoraRefri" checked="checked"  onclick= "jsCheckHoraRefri();"/></td>
                            <td colspan="6" style="padding-top: 16px">Hora Refrigerio</td>
                        </tr> <tr>
                            <td>&nbsp</td>
                            <td style="text-align: right">Ingreso</td>
                            <td>
                                <input type="text" id="refri_ingh" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                            <td>
                                <input type="text" id="refri_ingm" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                            <td style="text-align: right">Salida</td>
                            <td style="text-align: right">
                                <input type="text" id="refri_salh" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                            <td style="text-align: right">
                                <input type="text" id="refri_salm" maxlength="2" onblur="jsGetDuracion();"
                                       style="width: 35px;margin-right:4px"/>
                            </td>
                        </tr>

                        <tr>
                            <td colspan="6">&nbsp;</td>
                        </tr>
                        <tr>
                            <td colspan="3" style="text-align: right">Duraci&oacute;n Turno (hh:mm) </td>
                            <td colspan="3" style="text-align: left">
                                <input type="text" id="turno_dif" readonly="readonly" value=""
                                       style="width: 120px;text-align: center;font-weight: bold"/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="3" style="text-align: right">Duraci&oacute;n Refrigerio (hh:mm) </td>
                            <td colspan="3" style="text-align: left">
                                <input type="text" id="refri_dif" readonly="readonly" value=""
                                       style="width: 120px;text-align: center;font-weight: bold"/>
                            </td>
                        </tr>

                    </table>

                    <p id="error_ins" style="color: red"></p>
                </div>
            </div>

            <%-- para consulta  --%>
            <div style="display: none">
                <div id="dcon" title="Consulta de Turno">
                    <table>

                        <tr>
                            <td>Año</td>
                            <td colspan="3" >
                                <input type="text" id="anno_con" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>Und.&nbsp;Ejecutora</td>
                            <td colspan="3" >
                                <input type="text" id="uejecutora_con" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>Corte</td>
                            <td colspan="3" >
                                <input type="text" id="corte_con" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>


                        <tr>
                            <td>Descripci&oacute;n</td>
                            <td colspan="3">
                                <input type="text" id="turno_des_con" readonly="readonly"  
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>Fecha Inicio</td>
                            <td colspan="3">
                                <input type="text" id="turno_fec_con" readonly="readonly"  
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4" style="padding-top: 16px">Hora Turno</td>
                        </tr>
                        <tr>
                            <td style="text-align: right">Ingreso</td>
                            <td>
                                <input type="text" id="turno_ing_con" readonly="readonly" 
                                       style="width: 60px;margin-right:4px"/>
                            </td>
                            <td style="text-align: right">Salida</td>
                            <td style="text-align: right">
                                <input type="text" id="turno_sal_con" readonly="readonly" 
                                       style="width: 60px;margin-right:4px"/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4" style="padding-top: 16px">Hora Refrigerio</td>
                        </tr>
                        <tr>
                            <td style="text-align: right">Ingreso</td>
                            <td>
                                <input type="text" id="refri_ing_con" readonly="readonly" 
                                       style="width: 60px;margin-right:4px"/>
                            </td>
                            <td style="text-align: right">Salida</td>
                            <td style="text-align: right">
                                <input type="text" id="refri_sal_con" readonly="readonly" 
                                       style="width: 60px;margin-right:4px"/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4">&nbsp;</td>
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: right">Duraci&oacute;n Turno (hh:mm)</td>
                            <td colspan="2" style="text-align: left">
                                <input type="text" id="turno_dif_con" readonly="readonly" 
                                       style="width: 60px"/>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: right">Duraci&oacute;n Refrigerio (hh:mm)</td>
                            <td colspan="2" style="text-align: left">
                                <input type="text" id="refri_dif_con" readonly="readonly" 
                                       style="width: 60px"/>
                            </td>
                        </tr>
                    </table>

                    <p id="error_con" style="color: red"></p>
                </div>
            </div>

            <%-- para estado  --%>
            <div style="display: none">
                <div id="dest" title="Cambio de Estado de Turno">
                    <input type="hidden" id="idturno_est"/>
                    <input type="hidden" id="idestado_est"/>
                    <table>
                        <tr>
                            <td>Año</td>
                            <td colspan="3" >
                                <input type="text" id="anno_est" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>Und.&nbsp;Ejecutora</td>
                            <td colspan="3" >
                                <input type="text" id="uejecutora_est" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>Corte</td>
                            <td colspan="3" >
                                <input type="text" id="corte_est" readonly="readonly"
                                       maxlength="200" style="width: 300px"/>
                            </td>
                        </tr>

                        <tr>
                            <td>Turno</td>
                            <td>
                                <input type="text" id="turno_est" readonly="readonly" 
                                       maxlength="15" style="width: 100px"/>
                            </td>
                        </tr>
                        <tr>
                            <td>Estado 1</td>
                            <td colspan="2">
                                <input type="text" id="actual_est" readonly="readonly" 
                                       maxlength="200" style="width: 100px"/> 
                                Actual en base de datos
                            </td>
                        </tr>
                        <tr>
                            <td>Estado 2</td>
                            <td colspan="2">
                                <input type="text" id="despues_est" readonly="readonly" 
                                       maxlength="200" style="width: 100px"/> 
                                Después de clic en "<span style="font-weight: bold">Guardar</span>"
                            </td>
                        </tr>
                    </table>

                    <p id="error_est" style="color: red"></p>
                </div>
            </div>

            <%-- para mensajes  --%>
            <div style="display: none">
                <div id="dmsg" title="Mensaje">
                    <p id="msg" style="text-align: center;color: #800;margin: 20px"></p>
                </div>
            </div>
        </div>

        <%-- para excel  --%>
        <form id="to_excel" action="TurnoExc" target="_parent" method="post">
            <input type="hidden" id="data_excel" name="data_excel"/>
            <input type="hidden" id="anio_excel" name="anio_excel"/>
            <input type="hidden" id="ueje_excel" name="ueje_excel"/>
            <input type="hidden" id="cort_excel" name="cort_excel"/>
            <input type="hidden" id="estado_excel" name="estado_excel"/>
        </form>
    </body>
</html>

